<template>
  <div class="animated fadeIn">
    <div class="row">
      <div class="col-md-12">
        <b-card header="3d Switch">
          <c-switch type="3d" variant="primary" :checked="true"/>
          &nbsp;&nbsp;&nbsp;
          <c-switch type="3d" variant="secondary" :checked="true"/>
          &nbsp;&nbsp;&nbsp;
          <c-switch type="3d" variant="success" :checked="true"/>
          &nbsp;&nbsp;&nbsp;
          <c-switch type="3d" variant="warning" :checked="true"/>
          &nbsp;&nbsp;&nbsp;
          <c-switch type="3d" variant="info" :checked="true"/>
          &nbsp;&nbsp;&nbsp;
          <c-switch type="3d" variant="danger" :checked="true"/>
        </b-card>
      </div><!--/.col-->
    </div><!--/.row-->
  </div>
</template>

<script>
import cSwitch from '../../components/Switch'
export default {
  name: 'switches',
  components: {
    cSwitch
  },
  computed: {
    icon (icon) {
      return icon
    }
  }
}
</script>
